function getQueryVariable(variable) {
       let query = decodeURI(window.location.search.substring(1));
       let vars = query.split("&");
       for (let i=0;i<vars.length;i++) {
               let pair = vars[i].split("=");
               if(pair[0] === variable){return pair[1];}
       }
       return(false);
}

var app = new Vue ({
    el: '#app',
    data: {
        choosed_item: 'productDetail',
        styleProductDetail: {
            backgroundColor: "darkblue",
            color: "white"
        },
        styleOrderInfo: {
            backgroundColor: "lightgray",
            color: "darkblue"
        },
        styleUsageInfo: {
            backgroundColor: "lightgray",
            color: "darkblue"
        },
        productDetail: {
            name: '',
            item_num: '',
            uni_prot: '',
            antibody_type: '',
            molecular_weight: '',
            positive_part: '',
            pretreatment: '',
            clone_num: '',
            storage_validity_period: '',
            description: '',
            experimental_program: '',
            remarks: '',
            product_images_list: "",
            product_guide_book: "",
        },
        // 指定死规格和类型
        OrderType:[
            {
                leixing:'即用型',
                guige:'1mL/瓶',
            },
            {
                leixing:'即用型',
                guige:'3mL/瓶',
            },
            {
                leixing:'即用型',
                guige:'6mL/瓶',
            },
            {
                leixing:'即用型',
                guige:'10mL/瓶',
            },
        ],
        srcList: [],
        orderInfo: [],
        // product_guide_book: "/media/default.pdf",
        product_guide_book: "#",
        product_images_list_length: 0,
        product_images_list: [
        ]

    },
    methods: {
        Download:function (blob) {
            if(blob !== '#'){
                window.open(blob, '_blank');
            }
            else{
                this.$message.error('产品暂无说明书');
            }
            
         },
        choose: function (item) {
            this.choosed_item = item;
            if (item === "productDetail") {
                this.styleProductDetail.backgroundColor = "darkblue";
                this.styleProductDetail.color = "white";

                this.styleOrderInfo.backgroundColor = "lightgray";
                this.styleOrderInfo.color = "darkblue";

                this.styleUsageInfo.backgroundColor = "lightgray";
                this.styleUsageInfo.color = "darkblue";

            } else if (item === "orderInfo") {
                this.styleProductDetail.backgroundColor = "lightgray";
                this.styleProductDetail.color = "darkblue";

                this.styleOrderInfo.backgroundColor = "darkblue";
                this.styleOrderInfo.color = "white";

                this.styleUsageInfo.backgroundColor = "lightgray";
                this.styleUsageInfo.color = "darkblue";
            } else if (item === "usageInfo") {
                this.styleProductDetail.backgroundColor = "lightgray";
                this.styleProductDetail.color = "darkblue";

                this.styleOrderInfo.backgroundColor = "lightgray";
                this.styleOrderInfo.color = "darkblue";

                this.styleUsageInfo.backgroundColor = "darkblue";
                this.styleUsageInfo.color = "white";
            }
        },
        getProductDetail: function (item_num) {
            axios.get('/api/product_detail',{
                params:{
                    item_num: item_num
                }
            }).then(response => {
                this.productDetail = response.data.data[0].fields;
                this.orderInfo = response.data.order_data;
                if (response.data.data[0].fields["product_images_list"] !== '') {
                    let tmp_product_images_list = JSON.parse(response.data.data[0].fields["product_images_list"].replace(/\'/g,'\"'));
                    this.product_images_list_length = tmp_product_images_list.length;
                    if (tmp_product_images_list.length > 3) {
                        this.product_images_list = tmp_product_images_list.slice(0,3);
                    } else {
                        this.product_images_list = tmp_product_images_list
                    }
                }
                if (response.data.data[0].fields["product_guide_book"] !== '') {
                    this.product_guide_book = response.data.data[0].fields["product_guide_book"]
                }
                this.srcList = this.product_images_list
            });

        }
    },
    mounted () {
        let item_num=getQueryVariable("item_num");
        this.getProductDetail(item_num);
        $('.carousel-inner').children(":first").addClass("active");
        $('.carousel-indicators').children(":first").addClass("active");
    }
});